
import React from "react";
import { TabBar } from 'antd-mobile';
import { AppOutline,UnorderedListOutline,MessageFill,MessageOutline ,UserOutline } from 'antd-mobile-icons'
import {useNavigate} from "react-router-dom"
function Tab() {

    const navigate=useNavigate()
    const tabs = [
        {
            key: 'career',
            title: '职业',
            icon: <AppOutline />,
          
           
        },
        {
            key: 'company',
            title: '企业',
            icon: <UnorderedListOutline />,
        },
        {
            key: 'message',
            title: '消息',
            icon: (active) => active ? <MessageFill /> : <MessageOutline />,
          
        },
        {
            key: 'my',
            title: '我的',
            icon: <UserOutline />,
            path:'/my'
        },
    ];
    return (
        <div>
            <TabBar>
                {tabs.map(item => (<TabBar.Item key={item.key} icon={item.icon} title={item.title} 
                onPress={() => navigate(item.path)}
                />))}
            </TabBar>
        </div>
    )
}

export default Tab
